<template>
  <el-dialog center title="新增信息" :visible.sync="innerVisible" :before-close="beforeClose" width="50%">
    <el-row>
      <el-col :span="24">
        <el-form ref="searchForm" class="el-form-col el-form-s" :model="search" label-position="left"
                 label-width="120px">
          <el-row :gutter="15">
            <el-col :md="12" :lg="12" :xl="12">
              <el-form-item prop="phone" label="输入手机号：">
                <el-input clearable placeholder="输入联系手机" v-model="search.phone"></el-input>
              </el-form-item>
            </el-col>
            <el-col :md="2" :lg="2" :xl="2">
              <el-button type="primary" size="medium" @click.prevent="getUserByPhone" :loading="searchLoading">查询
              </el-button>
            </el-col>
          </el-row>
          <el-row :gutter="15" v-if="noUser">
            <el-col :span="24">
              <span class="font-red">很抱歉！未能查询到你输入的手机号对应的师傅.</span>
            </el-col>
          </el-row>
        </el-form>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="24">
        <Portlet title="基本信息">
          <table class="table show-table">
            <tbody>
            <tr style="border: 1px solid blue">
              <td width="120">姓名：</td>
              <td width="40%">{{userInfo.name}}</td>
              <td width="120">手机号:</td>
              <td width="40%">{{userInfo.registerPhone}}</td>
            </tr>
            <tr>
              <td>仓库面积：</td>
              <td>{{userInfo.area || 0}} m³</td>
              <td>从事该行业:</td>
              <td>{{userInfo.workYear || 0}} 年</td>
            </tr>
            <tr v-for="(car, index) in userInfo.fhbWorkerCars" :key="index">
              <td>车辆类型：</td>
              <td>{{car.type}}</td>
              <td>车牌号:</td>
              <td>{{car.plateNumber}}</td>
            </tr>
            </tbody>
          </table>
        </Portlet>
        <Portlet title="服务信息">
          <table class="table show-table">
            <tbody>
            <tr>
              <td width="120">服务范围：</td>
              <td width="80%">
                <p v-for="(item, index) in tempArr" :key="index">
                  {{item.key + ' : (' + item.value + ')'}}
                </p>
              </td>
            </tr>
            <tr v-for="(service, index) in userInfo.serviceBusinesses" :key="index">
              <td>{{service.businessName}}</td>
              <td>{{service.serviceName}}</td>
            </tr>
            </tbody>
          </table>
        </Portlet>
      </el-col>
    </el-row>
    <span slot="footer" class="dialog-footer">
      <el-button type="info" size="medium" @click.prevent="hide()">取消</el-button>
      <el-button type="primary" size="medium" @click.prevent="submit('insert')"
                 :loading="loading">提交</el-button>
    </span>
  </el-dialog>
</template>
<script>
import {dotData, alert} from '@/utils'

export default {
  components: {
  },
  data() {
    return {
      innerVisible: false,
      search: {
        phone: ''
      },
      searchLoading: false,
      loading: false,
      userInfo: {},
      tempArr: [],
      noUser: false
    }
  },
  props: {
    routeName: {
      type: String,
      required: true
    }
  },
  create() {
  },
  computed: {
    operateUrl() {
      let url = ''
      if (this.routeName === 'resourceDistribution') {
        url = '/ms-warehouse-order/resourceManage/operateDeliver'
      } else if (this.routeName === 'resourceInstall') {
        url = '/ms-warehouse-order/resourceManage/operateInstall'
      } else if (this.routeName === 'resourcePickup') {
        url = '/ms-warehouse-order/resourceManage/operatePickup'
      } else if (this.routeName === 'resourceSecondary') {
        url = '/ms-warehouse-order/resourceManage/operateSecondary'
      } else if (this.routeName === 'resourceDistributionInstall') {
        url = '/ms-warehouse-order/resourceManage/operateDeliverAndInstall'
      }
      return url
    }
  },
  methods: {
    getUserByPhone() {
      this.userInfo = {}
      this.tempArr = []
      this.searchLoading = true
      this.$ajax.get('/ms-fahuobao-app/workerUser/getWorkerByNameAndPhone', {name: this.search.phone}).then(response => {
        const success = dotData(response, 'success')
        if (success) {
          const data = dotData(response, 'data')
          if (data) {
            this.noUser = false
            this.userInfo = data
            if (Array.isArray(this.userInfo.coverDistrictList)) {
              this.merge(this.userInfo.coverDistrictList)
            }
          } else {
            // 没有
            this.noUser = true
          }
        }
      }).finally(_ => {
        this.searchLoading = false
      })
    },
    beforeClose(done) {
      done()
    },
    show() {
      this.search.phone = ''
      this.userInfo = {}
      this.tempArr = []
      this.noUser = false
      this.innerVisible = true
    },
    hide() {
      this.innerVisible = false
    },
    submit() {
      if (!this.userInfo.userId) {
        alert('请选择师傅')
        return
      }
      this.loading = true
      let postData = {
        workerId: this.userInfo.userId,
        operation: 'insert'
      }
      this.$ajax.post(this.operateUrl, postData).then(response => {
        const success = dotData(response, 'success')
        if (success) {
          this.hide()
          this.$confirm('新增成功', '提示', {
            type: 'success',
            center: true,
            confirmButtonText: '确定',
            showCancelButton: false,
            closeOnClickModal: false
          }).then(_ => {
            this.hide()
            this.$emit('refresh')
          })
        }
      }).finally(_ => {
        this.loading = false
      })
      // })
    },
    // 合并组装省市区
    merge(dataset) {
      var temp = {}
      var rt = []
      var keys = []
      for (var i in dataset) {
        var key = dataset[i]['province'] + '' + dataset[i]['city']
        if (temp[key]) {
          temp[key] += ',' + dataset[i]['district']
        } else {
          temp[key] = []
          keys.push(key)
          temp[key].push(dataset[i]['district'])
        }
      }
      for (let k = 0; k < keys.length; k++) {
        rt.push({key: keys[k], value: temp[keys[k]]})
      }
      this.tempArr = rt
    }
  }
}
</script>
